<template>
  <view class="padding-lr">
    <Title icon="title-icon1" title="填写用户信息"></Title>
  </view>
  <view class="step-user">
    <Cell dot title="联系人姓名">
      <input v-model="useDefVal.contactPerson" placeholder="请输入联系人姓名" />
      <!-- <text>{{ userStore.userInfo.username }}</text> -->
    </Cell>
    <Cell dot title="联系人电话">
      <input v-model="useDefVal.phone" placeholder="请输入联系人电话" type="number"/>
      <!-- <text>{{ userStore.userInfo.mobile }}</text> -->
    </Cell>
    <Cell dot rightArrow title="行驶里程" @click="showDistance = true">
      <image v-if="useDefVal.usedKm" class="icon-wh" :src="getImageSrc('static/icons/icon-shandian.png')"></image>
      <text v-if="useDefVal.usedKm">{{ useDefVal.usedKm }}</text>
      <text v-if="!useDefVal.usedKm" style="color: #999999;">请选择行驶里程</text>
    </Cell>
  </view>
  <ChooseDistance v-model:show="showDistance" title="选择行驶里程" v-model:current="useDefVal.usedKm"></ChooseDistance>
</template>

<script setup>
import { ref } from "vue"
import Title from "@/components/ui/title"
import Cell from "@/components/ui/cell"
import ChooseDistance from "../choose-distance";
import { useValue } from "@/path/hooks/v-model"
import { getImageSrc } from '@/path/until';
const showDistance = ref(false)
const emit = defineEmits(['update:value'])
const props = defineProps({
  values: Object
})
const { useDefVal } = useValue(props, emit)
</script>

<style lang="less" scoped>
@import url(./index.less);
</style>
